import React from 'react';
import Input from '../../components/input/input';
import styles from './register.module.scss';
import Button from '../../components/button/button';
import { Link } from 'react-router-dom';

export const Register = () => {
	return (
		<div className={styles.login}>
			{/* {error && <p style={{ color: 'red' }}>{error}</p>} */}
			<h2>Регистрация</h2>
			<form className={styles.form}>
				<div className={styles.input}>
					<label htmlFor="email">Ваш email</label>
					<Input id="email" name="email" placeholder="Email" />
				</div>
				<div className={styles.input}>
					<label htmlFor="password">Ваш пароль</label>
					<Input
						id="password"
						name="password"
						type="password"
						placeholder="Пароль"
					/>
				</div>
				<div className={styles.input}>
					<label htmlFor="name">Ваше имя</label>
					<Input id="name" name="name" placeholder="Имя" />
				</div>
				<Button appearance="big">Зарегистрироваться</Button>
			</form>
			<div>
				<div>
					<div>
          Есть акканут?{' '}
						<Link
							style={{ color: '#ffa600' }}
							className={styles.href}
							to="/auth/login"
						>
            Войти
						</Link>
					</div>
					<div>
						<Link
							style={{ color: '#ffa600' }}
							className={styles.href}
							to="/auth/login"
						>
            На главную
						</Link></div>
				</div>
			</div>
		</div>
	);
};
